import * as Cesium from "cesium";

interface PopupType {
  html: HTMLElement;
  position: {
    lng: number;
    lat: number;
    height: number;
  };
  offset?: {
    top: number;
    left: number;
  };
  entity?: unknown;
}

/**
 * @description: 弹窗
 * @private
 * @return {*}
 */
class Popup {
  #viewer: Cesium.Viewer;
  #options: PopupType;
  constructor(viewer: Cesium.Viewer, options: PopupType) {
    this.#viewer = viewer;
    this.#options = options;
    if (this.#viewer) {
      this.#viewer.container.append(this.#options.html);
      this.#viewer.scene.postRender.addEventListener(this.#postRender.bind(this));
    }
  }
  /**
   * @description: 场景渲染 实时更新信息窗体位置
   * @returns {void}
   */
  #postRender() {
    if (!this.#viewer) {
      return;
    }
    const {
      html,
      position: { lng, lat, height },
      offset: { top, left } = { top: 0, left: 0 },
    } = this.#options;
    const { x, y } = Cesium.SceneTransforms.worldToWindowCoordinates(
      this.#viewer.scene,
      Cesium.Cartesian3.fromDegrees(lng, lat, height)
    ) || { x: 0, y: 0 };
    html.style.display = "block";
    html.style.position = "absolute";
    html.style.left = top ? `${left + x}px` : `${x}px`;
    html.style.top = top ? `${y + top}px` : `${y}px`;
  }
  /**
   * @description: 删除信息窗体
   * @returns {void}
   */
  public remove() {
    if (!this.#viewer) {
      return;
    }
    this.#options.html.remove();
    this.#viewer.scene.postRender.removeEventListener(
      this.#postRender.bind(this)
    );
  }
}
export { Popup };

/*
 popup = new Popup(viewer, {
      html: parkingLotPointRef.value.$el,
      position: {
        lng: 118.958533,
        lat: 32.152333,
        height: 0
      }
    })
*/